<template>
    <lay-container :fluid="true" style="padding: 10px;padding-top: 10px;">
        <lay-card style="padding:10px;">
            <lay-row style="margin-bottom:10px;">
                <lay-breadcrumb>
                    <lay-breadcrumb-item title="内部消息"></lay-breadcrumb-item>
                    <lay-breadcrumb-item :title="addoredittip"></lay-breadcrumb-item>
                </lay-breadcrumb>
            </lay-row>

            <lay-row space="10">
                <lay-form :model="form">
                    <lay-col :md="24">

                        <lay-form-item label="收取人" prop="getUid">
                            <lay-col md="6">
                                <lay-transfer v-model="form.getUid" :dataSource="userList" :showSearch="true"
                                    :title="transferTitle" @change="changeTransfer">
                                    <template v-slot:item="{ data }">
                                        {{data.deptName}}-{{data.nickname}}
                                    </template>
                                </lay-transfer>
                            </lay-col>
                        </lay-form-item>

                        <lay-form-item label="标题" prop="title" required required-error-message="标题不能空">
                            <lay-col md="18">
                                <lay-input v-model="form.title"></lay-input>
                            </lay-col>
                        </lay-form-item>

                        <lay-form-item label="内容" prop="content">
                            <lay-col md="24">
                                <WangEditor v-model="form.content"></WangEditor>
                            </lay-col>
                        </lay-form-item>
                        <div v-permission="PerKey.Upload_Upload">
                            <lay-field title="附件">
                                <UploadAttments v-model="form.att" :uplabel="'附件上传'" :attList="getAttments" />
                            </lay-field>
                        </div>
                        <lay-form-item v-if="btnHide">
                            <lay-button @click="submitClick" type="primary" v-permission="PerKey.Notice_AddOrEdit">
                                {{addoredittip}}
                            </lay-button>
                        </lay-form-item>

                    </lay-col>
                </lay-form>
            </lay-row>
        </lay-card>
    </lay-container>

</template>

<script  lang="ts" >
import { reactive, ref, toRefs } from "vue";
import { layer } from "@layui/layer-vue";
import { getAdd, postAdd } from "../../api/module/notice";
import { uploadConfig } from "../../api/upload"
import { PerKey } from "../../library/permissionConst"
import { useRouter } from "vue-router";
import WangEditor from '../../layouts/Editor/wangEditor.vue'
import UploadImg from '../../layouts/Upload/UploadImg.vue'
import UploadAttments from '../../layouts/Upload/UploadAttments.vue'
import { Attment } from "../../types/attment"
export default {
    components: { WangEditor, UploadImg, UploadAttments },
    setup() {
        const router = useRouter();

        const data = reactive({
            form: {
                title: "",
                content: "",
                att: "",
                getUid: "",
            },
            getAttments: [<Attment>{}],
        });
        const { form, getAttments } = toRefs(data);

        let addoredittip = ref({});
        const userList = ref([] as any);
        getAdd().then((res) => {
            userList.value = res.userList;
            addoredittip.value = "发送消息";
            form.value = {
                title: "",
                content: "",
                att: "",
                getUid: "",
            }
            getAttments.value = []
            return;
        });

        const transferTitle = ['用户列表', '接收人']
        const changeTransfer = (chang: Array<number>) => {
            form.value.getUid = chang.toString()
            console.log(form.value.getUid)
            console.log(chang)
        }
        const btnHide = ref(true)
        const submitClick = function () {
            if (!form.value.title) {
                layer.msg("标题不能空");
                return;
            }
            if (form.value.att != null)//对附件进行类型转换
                form.value.att = String(form.value.att)
            form.value.getUid = String(form.value.getUid)
            //console.log(form.value.getUid)
            postAdd(form.value).then((res) => {
                btnHide.value = false
                done(res);
            });

        };
        const done = (res: any) => {
            if (res.status == 1) {
                layer.msg(res.msg, { time: 2000, icon: 1 }, () => {
                    router.push({ path: "/notice/postlist" });
                });
            }
            else {
                layer.msg(res.msg, { icon: 2 });
                return false;
            }
        };
        return {
            submitClick,
            form, getAttments,
            data,
            uploadConfig,
            PerKey,
            addoredittip,
            userList, transferTitle, changeTransfer,
            WangEditor, UploadImg
            , btnHide
        };
    }

}

</script>

<style scoped>
.tip {
    color: gray;
    line-height: 38px;
    height: inherit;
    padding-left: 10px;
}
</style>